<template>
  <view class="wrap">
    <view>
      <scroll-view class="scroll-listAll msg-list-item" scroll-y="true" @scrolltolower="lower">
        <u-empty
          text="暂无数据"
          mode="list"
          v-if="dataList.length < 1"
        ></u-empty>
        <view v-for="item in dataList" :key="item.id" class="item-card">
          <view class="msg-time">{{ item.createTime }}</view>
          <view class="tip-error">
            <u-badge
              :is-dot="true"
              type="error"
              v-if="item.status == 0"
            ></u-badge>
          </view>
          <u-card
            :title="item.code"
            sub-title=""
            padding="20"
            margin="0rpx 20rpx"
            thumb="/static/aidex/images/list-icon.png"
            @click="viewItem(item)"
          >
            <view class="" slot="body">
              <view class="u-body-item u-flex u-col-between u-p-t-0">
                <view class="u-body-item-title u-line-2">{{
                  item.message || '消息内容占位'
                }}</view>
              </view>
            </view>
          </u-card>
        </view>
        <u-divider v-if="!listHasMore">已经到底了</u-divider>
      </scroll-view>
    </view>
  </view>
</template>
<script>
export default {
  data() {
    return {
      listHasMore: true, //有无下一页数据
      page: {
        pageNum: 1,
        pageSize: 10,
      },
      dataList: [],
    }
  },
  // onLoad() {
  //   this.getList()
  // },
  onShow() {
    // console.log('onShow')
    this.getList()
  },
  methods: {
    getList() {
      this.$u.api.getTaskCount({ ...this.page }).then((response) => {
        if (response.code == '200') {
          if (response.rows.length < 10) {
            this.listHasMore = false
          }
          let list = response.rows
          if (this.page.pageNum == 1) {
            this.dataList = []
          }
          let temp = JSON.parse(JSON.stringify(list))
          this.dataList = this.dataList.concat(temp)
        }
      })
    },
    lower: function (e) {
      // console.log('lower');
      if (!this.listHasMore) {
        return
      }
      this.page.pageNum++
      this.getList()
    },
    viewItem(item) {
      this.$u.api.clickTask({ id: item.id }).then(() => {})
      uni.navigateTo({ url: item.url })
    },
  },
}
</script>
<style lang="scss" scoped>
@import '../../../common/uni.css';
page {
  background-color: #f5f5f5;
}
.item-card {
  position: relative;
}
.tip-error {
  position: absolute;
  top: 15px;
  right: 0px;
}
.wrap .search {
  background: #ffffff;
}
.u-dropdown {
  background: #ffffff;
}
.msg-time {
  font-size: 26rpx;
  padding: 5px 0;
  color: #999999;
  text-align: center;
}
.u-card__foot {
  .u-icon {
    margin-right: 10px;
  }
}
.apply-text {
  font-size: 28rpx;
  color: #333333;
  span {
    color: #999999;
  }
}
.user-images {
  width: 28px;
  height: 28px;
  margin-right: 8px;
}
.apply-list-foot {
  font-size: 28rpx;
  justify-content: space-around;
}
.personnel-list {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  .personnel-user {
    position: relative;
    margin: 5px 9px 0;
  }
  .user-images {
    width: 32px;
    height: 32px;
    margin-right: 0;
  }
  .iconfont {
    position: absolute;
    top: -12px;
    right: -5px;
    color: #fe0100;
  }
}
.agree-text {
  color: #4094ff;
}
.refuse-text {
  color: #ff4400;
}
</style>
